<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Yy</title>
</head>

<body>
    <button class="get">查询数据</button>
    <button class="post">添加数据</button>
    <button class="put">修改数据</button>
    <button class="delete">删除数据</button>
    <script src="./js/axios.min.js"></script>
    <script src="./js/jquery.js"></script>
    <script src="http://127.0.0.1:8080/json.js"></script>
    <script>
        axios.get("http://127.0.0.1:3000/data").then(res => {
            console.log(res.data)
        })


        document.querySelector(".get").onclick = function() {
            axios.get("http://127.0.0.1:3000/fruits").then(res => {
                console.log(res.data)
            })
        }
        document.querySelector(".post").onclick = function() {
            axios.post("http://127.0.0.1:3000/fruits", {
                fruit: "草莓"
            }).then(res => {
                console.log(res.data)
            })
        }
        document.querySelector(".put").onclick = function() {
            axios.put("http://127.0.0.1:3000/fruits/0", {
                fruit: "西瓜"
            }).then(res => {
                console.log(res.data)
            })
        }
        document.querySelector(".delete").onclick = function() {
            axios.delete("http://127.0.0.1:3000/fruits/0").then(res => {
                console.log(res.data)
            })
        }




        // $(".get").click(function() {
        //     $.ajax({
        //         url: "http://127.0.0.1:8080/data",
        //         dataType: "jsonp"
        //     }).done(res => {
        //         console.log(res)
        //     })
        // })
        // $(".get").click(function() {
        //     $.ajax({
        //         url: "http://127.0.0.1:8080/fruits",
        //         dataType: "jsonp"
        //     }).done(res => {
        //         console.log(res)
        //     })
        // })
        // $(".post").click(function() {
        //     $.ajax({
        //         url: "http://127.0.0.1:8080/fruits",
        //         type: "post",
        //         data: {
        //             fruit: "草莓"
        //         }
        //     }).done(res => {
        //         console.log(res, "jquery的ajax post方法")
        //     })
        // })

        // $(".put").click(function() {
        //     $.ajax({
        //         url: "http://127.0.0.1:8080/fruits/0",
        //         type: "put",
        //         data: {
        //             fruit: "西瓜"
        //         }
        //     }).done(res => {
        //         console.log(res, "jquery的ajax put方法")
        //     })
        // })
        // $(".delete").click(function() {
        //     $.ajax({
        //         url: "http://127.0.0.1:8080/fruits/0",
        //         type: "delete",
        //     }).done(res => {
        //         console.log(res, "jquery的ajax delete")
        //     })
        // })
    </script>
</body>

</html>